<template>
	<div class="update-birthday">
		<!--
      currentDate 双向绑定了日期选择器
        设置日期选择器的默认值
        同步日期选择器选择的日期
      min-date: 可选的最小日期
      max-date: 可选的最大日期
     -->
		<van-datetime-picker
			v-model="currentDate"
			type="date"
			:min-date="minDate"
			:max-date="maxDate"
			@cancel="$emit('close')"
			@confirm="onConfirm"
		/>
	</div>
</template>

<script>
import { updateUserProfile } from '@/api/user'
import dayjs from 'dayjs'
export default {
	name: 'UpdateBirthday',
	components: {},
	props: {
		value: {
			type: String,
			required: true,
		},
	},
	data() {
		return {
			minDate: new Date(1970, 0, 1),
			maxDate: new Date(),
			currentDate: new Date(this.value),
		}
	},
	computed: {},
	watch: {},
	created() {},
	mounted() {},
	methods: {
		// 确定事件
		async onConfirm() {
			this.$toast.loading({
				message: '保存中...',
				forbidClick: true, // 禁止背景点击
				duration: 0, // 持续展示
			})
			try {
				const currentDate = dayjs(this.currentDate).format('YYYY-MM-DD')
				await updateUserProfile({
					birthday: currentDate,
				})

				this.$emit('input', currentDate)
				this.$emit('close')
				this.$toast.success('更新成功')
			} catch (err) {
				this.$toast.fail('更新失败')
			}
		},
	},
}
</script>

<style scoped lang="less"></style>
